<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="/common/taglibs.jsp"%>
<html>
<head>
<title>短信发送</title>
<%@include file="/common/ec.jsp"%>
<%@include file="/common/meta.jsp"%>
<%@include file="/common/extjs.jsp"%>
<script type="text/javascript" src="${ctx}/scripts/extjs/diy/TreeCheckNodeUI.js"></script>
<script type="text/javascript" src="${ctx}/pages/admin/security/user/selector.js"></script>
<style type="text/css">
.msgInput{
	border:0px;
	border-bottom: 1px dotted #000;
	width: 690px;
}
</style>
</head>
<body>
<table align="center" width="790" style="border-bottom: 2px solid #99BBE8;">
  <tr><td align="left" style="padding-left: 20px;">
  	<a href="#" onClick="sendSms()" title="发送手机短信" style="color: red; font-weight: bold;">
  	  <img src="${ctx}/images/icons/send.png">&nbsp;短信发送
  	</a>
  	&nbsp;&nbsp;
  	<a href="${ctx}/smssend/index.do">
  		<img src="${ctx}/images/exticons/arrow-up.gif">&nbsp;短信列表</a>
  	&nbsp;&nbsp;&nbsp;
  	<!-- 
	  	<a href="${ctx}/statistics/statByPersonal.do">
  		<img src="${ctx}/images/icons/gra.gif">&nbsp;短信统计</a>
  	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;【您还可以发送&nbsp;<font color="red">${remainSize}</font>&nbsp;条短信】
  	 -->
  </td></tr>
</table>
<s:hidden id="remainSize" name="remainSize"/>
<s:form id="saveFrom" action="save.do" method="post" theme="simple">
<table width="790" align="center">
	<tr><td height="10"></td></tr>
	<tr>
		<td><%@ include file="/common/messages.jsp"%></td>
	</tr>
	<tr>
		<td>
		<table width="790">
			<tr><td height="5" colspan="3"></td></tr>
			<tr height="26">
				<td width="82" align="right">接&nbsp;收&nbsp;人：</td>
				<td width="573">
					<s:textfield name="receivers" id="receivers" onclick="showWin()" cssClass="msgInput" readonly="true" cssStyle="width:550px;"/>
    				<s:hidden name="receiverIds" id="receiverIds"/>
			  </td>
				<td width="154" id="recInfo">选择接收人</td>
			</tr>
			<tr height="26">
				<td width="82" align="right">手机号码：</td>
				<td width="573"><s:textfield id="mobiles" name="mobiles" 
					cssClass="msgInput" cssStyle="width:550px;" onblur="checkNum()"></s:textfield>
			  </td>
				<td width="154" id="numInfo">多个号码请用分号隔开</td>
			</tr>
			<tr>
				<td align="right">短信内容：</td>
				<td><textarea id="content" name="content"
					style="width: 550px; height: 200px;" onBlur="checkContent()" onkeydown='countChar("content","counter");' onkeyup='countChar("content","counter");'></textarea>
					<font color="red">*</font>
					<s:hidden name="smsNums" id="smsNums"/>
				</td>
				<td>
					<span id="contInfo">编辑短信内容</span><br/><br/>
					还可以输入<font color="red"><span id="counter">300</span></font>字<br/><br/>
					分<font color="red"><span id="tiaoshu">1</span></font>条发送短信
				</td>
			</tr>
		</table>
		<table width="790">
			<tr height="26">
				<td>&nbsp;&nbsp;&nbsp;<font color="#99BBE8"><b>说明:</b>接收人和手机号码必须任选其一，如果选择了接收人，可以不输入手机号码；如果输入了手机号码，可以不选择接收人。</font></td>
			</tr>
		</table>
		</td>
	</tr>
</table>
<table width="790" align="center" style="margin-bottom: 0px;">
	<tr>
		<td style="text-align: center;">
			<input type="button" value="发送" onClick="sendSms()" class="button">&nbsp;&nbsp;
			<s:reset value="取消" cssClass="button" />
		</td>
	</tr>
</table>
</s:form>

<div id="emp_sel_container" class="x-hidden">
    <div class="x-window-header">员工列表</div>
    <div id="emp_grid"></div>
</div>
<script type="text/javascript">
	function checkNum(){
		var mobiles = document.getElementById("mobiles").value;
		if (mobiles == null || mobiles == ""){
			document.getElementById('numInfo').innerHTML = '<font color="red">'+'请输入手机号'+'</font>';
			return false;
		}
		if (mobiles.indexOf(";") < 0){
			if ( isNaN(mobiles)){
				document.getElementById('numInfo').innerHTML = '<font color="red">'+'手机号码必须是数字'+'</font>';
				return false;
			}
			if (mobiles.length != 11){
				document.getElementById('numInfo').innerHTML = '<font color="red">'+'手机号码位数不正确'+'</font>';
				return false;
			}
		}else{
			arrayMobile = mobiles.split(";");
			if (arrayMobile.length > 0){
				for(i = 0; i < arrayMobile.length; i++){
					if ( isNaN(arrayMobile[i])){
						document.getElementById('numInfo').innerHTML = arrayMobile[i] + '<font color="red">'+' 手机号码必须是数字'+'</font>';
						return false;
					}
					if (arrayMobile[i].length != 11 && arrayMobile[i].length !=0){
						document.getElementById('numInfo').innerHTML = arrayMobile[i] + '<font color="red">'+' 手机号码位数不正确'+'</font>';
						return false;
					}
				}
			}
		}
		document.getElementById('numInfo').innerHTML = '多个号码请用分号隔开';
		return true;
	}
	function checkContent() {
		var content = document.getElementById("content").value;
		if (content == null || content == ""){
			document.getElementById('contInfo').innerHTML = '<font color="red">'+'请输入短信内容'+'</font>';
			return false;
		}
		document.getElementById('contInfo').innerHTML = '编辑短信内容';
		return true;
	}
	function checkReceiver() {
		var rec = document.getElementById("receivers").value;
		if (rec == null || rec == ""){
			document.getElementById('recInfo').innerHTML = '<font color="red">'+'请选择接收人'+'</font>';
			return false;
		}
		document.getElementById('recInfo').innerHTML = '选择接收人';
		return true;
	}

	function checkNumAndReceiver() {
		var rec = document.getElementById("receivers").value;
		var mobiles = document.getElementById("mobiles").value;
		if((rec != "" && rec != null) || (mobiles != "" && mobiles != null)) {
			document.getElementById('recInfo').innerHTML = '选择接收人';
			return true;
		} else {
			document.getElementById('recInfo').innerHTML = '<font color="red">'+'请选择接收人或输入号码'+'</font>';
			return false;
		}
	}
	function countChar(textareaName,spanName){
		var val = document.getElementById(textareaName).value;
		 if(300-val.length <=0) {
			document.getElementById(spanName).innerHTML = 0;
			document.getElementById(textareaName).value = val.substring(0,300);
		 }else{
			document.getElementById(spanName).innerHTML = 300-val.length;
			document.getElementById("tiaoshu").innerHTML = Math.floor(val.length/71)+1;
			document.getElementById("smsNums").value = Math.floor(val.length/71)+1;
		 }
	}
	function sendSms() {
		var remainSize = document.getElementById("remainSize").value;
		if(remainSize <= 0) {
			alert("您本月定额短信条数已用完，请联系管理员!");
		}else {
			if(checkNumAndReceiver()&&checkContent()) {
				document.getElementById("saveFrom").submit();
			}
		}
	}
	/* -- user select component Start-- */
	var emp;
	emp = new UserSelector({
	    url: '${ctx}/security/user/userTree.do?showPhoneNum=1',
	    el: 'emp_sel_container',
	    idsEl:'receiverIds',
	    textEl:'receivers',
	    width : 250,
		height : 450,
		multiSel : true
	});

	function showWin() {   
		emp.show(true);
	}
	/* -- user select component End-- */
</script>
</body>
</html>